<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <ul>
        <li>0</li>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
        <li>6</li>
        <li>7</li>
        <li>8</li>
        <li>9</li>
    </ul>
</body>
<script>
/*******************************************/
    // console.log(a);//undefined
    // console.log(getA);//undefined
    // if(true){
    //     console.log(getA);//function getA(){}
    //     console.log(a)//undefined
    //     var a = 1;
    //     function getA(){

    //     }
    // }
/*******************************************/

    let oli = document.getElementsByTagName("li");
    // for(var i=0;i<oli.length;i++){
    //     oli[i].onclick=function(){
    //         console.log(i)//10
    //     }
    // } 因为声明的i是全局作用域
    //解决办法  将i变成局部作用域，哪怕就算是使用闭包，也是局部作用域
    // for(var i=0;i<oli.length;i++){
    //     (function(index){ //index就是一个局部作用域
    //         oli[index].onclick=function(){
    //             console.log(index)
    //         }
    //     })(i)
    // }
    //或者，使用let声明变量i
    // for(let i = 0;i<oli.length;i++){
    //     oli[i].onclick=function(){
    //         console.log(i)
    //     }
    // }
/*******************************************/

        // for(let i=0;i<3;i++){
        //     let i="abc";
        //     console.log(i)//abc
        // }
/*******************************************/
    {
        let a = 40;
        {
            let a = 50;
            console.log("我是子作用域:",a)//我是子作用域: 50
        }
        console.log("我是父作用域:",a)//我是父作用域: 40
    }

</script>
</html>